<template>
    <div class="home">
      <Layout :style="{padding: '0 24px 24px'}">
        <Breadcrumb :style="{margin: '24px 0'}">
          <BreadcrumbItem>红包管理</BreadcrumbItem>
          <BreadcrumbItem  :to="{path: '/qrcode'}">我的二维码</BreadcrumbItem>
          <BreadcrumbItem>扫码记录</BreadcrumbItem>
        </Breadcrumb>
        <Content :style="{padding: '24px 182px 24px 24px', minHeight: this.$h.GetContentBodyHeight()+'px', background: '#fff'}">
          <Table :loading="loading_" border :columns="columns7" :data="Redbao" stripe></Table>
          <Page :total="total" :page-size="pagesize" @on-change="changpage" show-total/>
        </Content>
      </Layout>
    </div>
</template>
<script>
  import {
    mapGetters
  } from 'vuex'
    export default {
        props: {},
        components: {},
        data() {
            return {
              loading_:false,
              total:0,//数据总条数
              pagesize:10,//每页条数
              columns7: [
                {
                  title: '扫码用户',
                  key: 'name',
                  width: 350,
                  render: (h, params) => {
                    return h('div', [
                      h('Icon', {
                        props: {
                          type: 'person'
                        }
                      }),
                      h('strong', params.row.name)
                    ]);
                  }
                },
                {
                  title: '获取金额',
                  key: 'money',
                  // width: 200,
                },
                {
                  title: '扫码时间',
                  key: 'created_at',
                },
              ],
              Alldata:[],
              Redbao:[],
            }
        },
        methods: {

          GetScavenging(){  //获取扫码记录
              this.http.Excel({
                'api': 'getredinfolist',
                'data':{
                  'brid':this.GetScavengingID
                },
              }).then((res) => {
               if(res.data.Response.code == 200){
                 this.Processingdata(res.data.Response.data)
               }
              }, (err) => {
                if (err.request.response.Response.code == 500) {

                }
              });
          },
          Processingdata(data) { //数据处理
            this.Alldata = data;
            this.total=data.length;//数据总条数
            this.Redbao = data.slice(0, this.pagesize);
          },
          changpage(page){  //点击分页
            this.Redbao = this.Alldata.slice((page - 1) * this.pagesize, page * this.pagesize)
          },
        },
        watch: {},
        computed: {
          ...mapGetters([
            'GetScavengingID'
          ]),
        },
        created() {

        },
        mounted() {
          this.GetScavenging();
        }
    }
</script>
<style scoped>
    .home {
        width: 100%;
        height: 100%;
    }
</style>
